<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/register.css">
    <script src="./js/jquery-1.12.3.min.js"></script>
    <script src="./js/layer/layer.js"></script>
    <script src="./js/validation/jquery.validate.min.js"></script>
    <script src="./js/jquery.idcode.js"></script>
    <link rel="stylesheet" href="./css/jquery.idcode.css">
    <!-- <script src="./js/register.js"></script> -->
</head>

<body>
    <div id="header">
        <div class="header-wrap">
            <img src="./images/logo1.jpg" alt="">
            <div class="fr_login">
                如您已有账户 <a class="logina3" href="./login.html">请登录</a>
                <a href="#" class="logina1"><i>在线客服</i></a>
                <a href="#" class="logina2"><i></i>帮助</a>
            </div>
        </div>
    </div>
    <div id="content">
        <div class="content-wrap">
            <div class="tabFrom">
                <div class="tabbox">
                    <a href="#">账号注册</a>
                </div>
                <form class="left-ctr">
                    <!-- <span class="left-ctr-t">
                        <h2>
                            //手机注册
                        </h2>
                    </span> -->
                    <dl>
                        <dt>设置用户名:</dt>
                        <dd>
                            <input name="uname" type="text" placeholder="请输入用户名">
                            <label id="uname-error" class="error" for="uname"></label>
                        </dd>
                    </dl>

                    <dl class="dl-2">
                        <dt>设置密码:</dt>
                        <dd>
                            <input id="upwd" name="upwd" type="password" placeholder="请输入密码">
                            <label id="upwd-error" class="error" for="upwd"></label>
                        </dd>
                    </dl>

                    <dl class="dl-2">
                        <dt>请确认密码:</dt>
                        <dd>
                            <input name="upwd2" type="password" placeholder="请再次输入密码">
                            <label id="upwd2-error" class="error" for="upwd2"></label>
                        </dd>
                    </dl>

                    <dl class="dl-2">
                        <dt>请输入手机号:</dt>
                        <dd>
                            <input name="uphone" placeholder="请输入手机号">
                            <label id="uphone-error" class="error" for="uphone"></label>
                        </dd>
                    </dl>
                    <dl class="dl-2">
                        <dt>请输入验证码:</dt>
                        <dd>
                            <input style="float: left;" type="text" id="Txtidcode" placeholder="请输入验证码" class="txtVerification"><span style="float: right;" id="idcode"></span>
                        </dd>
                    </dl>

                    <p>点击注册，表示您同意购酒网 <a href="#">《服务协议》</a></p>
                    <button class="reg">立即注册</button>
                </form>
            </div>
            <a href="./index.html"><img src="./images/login_form.jpg" alt=""></a>
        </div>
    </div>
    <div id="footer">
        <div class="links">
            <li><a href="#">关于我们</a></li>
            <li><a href="#">关于我们</a></li>
            <li><a href="#">关于我们</a></li>
            <li><a href="#">关于我们</a></li>
        </div>
        <div class="banquan">
            Copyright©2009-2020 gjw.com, All Rights Reserved 购酒网(上海)供应链管理有限公司 版权所有
        </div>
    </div>
</body>

</html>
<script src="./js/register.js"></script>
<script>

    // $(function () {
    //     $.idcode.setCode(); //加载生成验证码方法


    //     $.validator.addMethod("checkPhone", function (value, ele, params) {
    //         return /^[1][3-9]\d{9}$/.test($(ele).val())
    //     }, "手机号不合法");

    //     //添加用户名校验规则
    //     $.validator.addMethod("checkUser", function (val, ele, params) {
    //         //value 输入的值
    //         //ele 那个元素
    //         return /^[a-z]\w{5,17}$/.test($(ele).val())
    //         // console.log(arguments);
    //     }, "用户名不合法");

    //     $("form").validate({
    //         // 规则
    //         rules: {
    //             uname: {
    //                 required: true,
    //                 rangelength: [6, 18],
    //                 checkUser: true,
    //                 remote: "http://127.0.0.1:8080/api/isReg"
    //             },
    //             upwd: {
    //                 required: true,
    //                 rangelength: [6, 18],
    //             },
    //             upwd2: {
    //                 equalTo: "#upwd"
    //             },
    //             uphone: {
    //                 checkPhone: true,
    //             }
    //         },
    //         // 消息提示
    //         messages: {
    //             uname: {
    //                 required: "请填写用户名",
    //                 rangelength: "长度在6-18之间",
    //                 remote: "该用户名已注册!"
    //             },
    //             upwd: {
    //                 required: "请填写密码",
    //                 rangelength: "长度在6-18之间",
    //             },
    //             upwd2: {
    //                 equalTo: "两次密码不一致"
    //             },
    //             uphone: {
    //                 checkPhone: "请输入正确手机号",
    //             }
    //         },
    //         // 提交
    //         submitHandler(from) {
    //             var dataStr = $(from).serialize();
    //             console.log(dataStr);


    //             var IsBy = $.idcode.validateCode()
    //             if (!IsBy) {
    //                 layer.msg('验证码错误,请重新输入');
    //                 return false;
    //             }


    //             $.ajax({
    //                 url: "http://127.0.0.1:8080/api/reg",
    //                 data: dataStr,
    //                 async: true,
    //                 type: "post",
    //                 dataType: "json",
    //             }).done(function (res) {
    //                 console.log(res);
    //                 layer.alert(res.msg);
    //                 layer.msg(res.msg);
    //                 if(res.status >=1){
    //                     location.href="./login.html";
    //                 }
    //             })

    //             return false;
    //         }

    //     })
    // })




    // $(function () {
    //     $.idcode.setCode(); //加载生成验证码方法
    //     $.validator.addMethod("checkPhone", function (val, ele, params) {
    //         //value 输入的值
    //         //ele 那个元素
    //         return /^[1][3-9]\d{9}$/.test($(ele).val())
    //         // console.log(arguments);
    //     }, "手机号不合法");

    //     $("form").validate({
    //         //规则
    //         relus: {
    //             uname: {
    //                 required: true,
    //                 rangelength: [6, 18],
    //                 // checkPhone: true,
    //                 remote: "手机号已注册!"
    //             },
    //             upwd: {
    //                 required: true,
    //                 rangelength: [6, 18]
    //             },
    //             upwd2: {
    //                 equalTo: "#upwd"
    //             }
    //         },
    //         //消息提示
    //         messages: {
    //             uname: {
    //                 required: "必填!",
    //                 rangelength: "必须是{0}-{1}位",
    //                 // checkPhone: "亲,手机号不对哦~"
    //             },
    //             upwd: {
    //                 required: "密码必填!",
    //                 rangelength: "必须是{0}-{1}位"
    //             },
    //             upwd2: {
    //                 equalTo: "两次密码不一致"
    //             }
    //         },
    //         //提交

    //         submitHandler(from) {
    //             // console.log(submitHandler);
    //             var dataStr = $(from).serialize();
    //             // console.log(dataStr)

    //             var IsBy = $.idcode.validateCode()
    //             if (!IsBy) {
    //                 layer.msg('验证码错误,请重新输入');
    //                 return false;
    //             }

    //             $.ajax({
    //                 url: "http://127.0.0.1:8080/api/reg",
    //                 data: dataStr,
    //                 async: true,
    //                 type: "post",
    //                 dataType: "json"
    //             }).done(function (res) {
    //                 console.log(res)
    //                 layer.alert("注册成功")

    //             })
    //             return false;
    //         }
    //     })

    // })
</script>